<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8" />
    <link rel="manifest" href="./manifest.json" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport"
        content="width=device-width，initial-scale=1.0，maximum-scale=1.0，minimum-scale=1.e，user-scalable=no" />
    <title>Code Blockly</title>
    <meta name="description" content="新一代图形化编辑器" />
    <link rel="stylesheet" href="https://unpkg.com/mdui@1.0.2/dist/css/mdui.min.css" />
    <link rel="stylesheet" href="./static/css/style.css" />
    <link rel="stylesheet" href="./static/css/home.css" />
    <link rel="shortcut icon" href="./static/logo/logo.svg" type="image/x-icon" />
    <style>
        @media (max-width: 1000px) {
            * {
                font-size: 0.5em;
            }
        }
    </style>
    <script>
        !(function () {
            const date = new Date();
            const list = [
                [12, 13],
                [2, 21],
                [3, 21],
                [9, 18]
            ];
            if (
                list
                    .map((a) => {
                        return JSON.stringify(a);
                    })
                    .includes(
                        JSON.stringify([
                            date.getMonth() + 1,
                            date.getDate(),
                        ])
                    )
            ) {
                document.querySelector("html").style.filter =
                    "grayscale(1)";
            }
        })();
    </script>
</head>

<body align="center">
    <div class="header">
        <div class="h1">欢迎来到Code Blockly主页！</div>
        <div class="h2">新一代图形化编辑器</div>
    </div>
    <div class="content">
        <div class="h1">介绍</div>
        <div class="content-text">
            Code Blockly 基于开源的 Google Blockly 开发，其含有多种语言的图形化界面非常利于新手快速上手编程，体验编程的乐趣。
        </div>
    </div>
    <div class="content">
        <div class="h1">编辑器</div>
        <div class="h2">Web</div>
        <div class="content-text">
            <a href="./editor/web" class="blue-button"><span>正式版（未同步）</span></a>
            <a href="./editor/web-dev" class="blue-button"><span>预览体验版</span></a>
        </div>
        <div class="h2">Python</div>
        <div class="content-text">
            <a href="./editor/py" class="blue-button"><span>正式版（未同步）</span></a>
            <a href="./editor/py-dev" class="blue-button"><span>预览体验版</span></a>
        </div>
    </div>
    <div class="content">
        <div class="h2">更多版本敬请期待</div>
    </div>
    <footer class="app-footer" align="left">
        <div class="app-footer-spacer"></div>
        <div class="app-footer-left">
            <div class="app-footer-p">
                <a class="app-footer-p-title">关于我们</a>
                <div class="app-footer-p-content">
                    <div>
                        <a class="app-url" href="/?page=about">团队介绍</a>
                    </div>
                    <div>
                        <a class="app-url" href="/?page=contact">联系我们</a>
                    </div>
                </div>
            </div>
            <div class="app-footer-p">
                <a class="app-footer-p-title">其他服务</a>
                <div class="app-footer-p-content">
                    <a class="app-url" href="/?page=monitor">环境监测</a>
                </div>
            </div>
        </div>
        <div class="app-footer-right">
            <div class="app-footer-p deliver-door-footer">
                <a class="deliver-door-footer-div" href="https://github.com/code-dream-star" target="_blank">
                    <svg height="40" winth="40" aria-hidden="true" viewBox="0 0 16 16" version="1.1" width="32"
                        data-view-component="true">
                        <path fill-rule="evenodd"
                            d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0016 8c0-4.42-3.58-8-8-8z">
                        </path>
                    </svg>
                </a>
                <a class="deliver-door-footer-div" href="https://jq.qq.com/?_wv=1027&k=ojnNZmP4" target="_blank">
                    <svg height="40" winth="40" aria-hidden="true" viewBox="0 0 72 72" version="1.1" width="32"
                        data-view-component="true">
                        <g>
                            <circle fill="#55B9EC" cx="36" cy="36" r="36" />
                            <path
                                d="M47.3473397,48.2858535 C47.3473397,48.2858535 50.5293531,49.351603 50.2644855,52.1156411 C50.2644855,52.1156411 50.3682793,55.2009893 43.4593447,54.9894058 C43.4593447,54.9894058 38.6004236,54.618479 37.1420615,52.5966318 L35.8573787,52.5966318 C34.4007407,54.6205027 29.5418579,54.9894058 29.5418579,54.9894058 C22.6287471,55.2030129 22.738901,52.1156411 22.738901,52.1156411 C22.4697422,49.3516404 25.6539012,48.2858535 25.6539012,48.2858535 C23.8732381,45.9429586 22.9000515,43.3365025 22.9000515,43.3365025 C18.5797547,50.199698 19.0120181,42.3783811 19.0120181,42.3783811 C19.8220235,37.750415 23.2246514,34.7191057 23.2246514,34.7191057 C22.7389394,30.5160303 24.5198707,29.7694923 24.5198707,29.7694923 C24.8907544,16.7664798 36.2622089,16.9947771 36.499835,17.0009604 C36.7392619,16.994852 48.1064635,16.7665173 48.4815235,29.7695298 C48.4815235,29.7695298 50.2646004,30.5140067 49.777011,34.7191432 C49.777011,34.7191432 53.1774549,37.75049 53.9872304,42.3784185 C53.9893377,42.3783811 54.4196088,50.199698 50.1013426,43.3365025 C50.101266,43.3365025 49.13034,45.9428836 47.3473397,48.2858535 Z"
                                fill="#FFFFFF" fill-rule="nonzero" />
                        </g>
                    </svg>
                </a>
            </div>
            <div class="app-footer-p copyright">
                <a>©️ Code Dream Star 2023</a>
            </div>
        </div>
        <div class="app-footer-spacer"></div>
    </footer>
</body>

</html>